import { useHistory } from "react-router";
import { Card, Form, Input, Button, Checkbox, message } from "antd";
import { UserOutlined, LockOutlined } from '@ant-design/icons';
import AdminsApi from "../../api/admins"



//eslint-disable-next-line
export default () => {
    let history = useHistory();

    const onFinish = async (values) => {
        const { adminName, adminPassword } = values;
        const { status, token } = await AdminsApi.login({ adminName, adminPassword });
        console.log(status)
        if (status) {
            AdminsApi.setToken(token);
            message.success("登录成功，即将跳转...", 1, () => {
                history.push("/info/admins")
            });
        } else {
            message.error('输入错误！请重新登录！');
        }

    };


    return (
        <div className="components-form-demo-normal-login" style={{ height: "100vh", backgroundColor: "#f2f2f2", paddingTop: "50px" }}>
            <Card title="登录" bordered={true} style={{ width: 400, margin: "auto" }}>
                <Form
                    name="normal_login"
                    className="login-form"
                    initialValues={{
                        remember: true,
                    }}
                    onFinish={onFinish}
                >
                    <Form.Item
                        name="adminName"
                        rules={[
                            {
                                required: true,
                                message: '请输入用户名！',
                            },
                        ]}
                    >
                        <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="adminName" />
                    </Form.Item>
                    <Form.Item
                        name="adminPassword"
                        rules={[
                            {
                                required: true,
                                message: '请输入密码！',
                            },
                        ]}
                    >
                        <Input
                            prefix={<LockOutlined className="site-form-item-icon" />}
                            type="adminPassword"
                            placeholder="adminPassword"
                        />
                    </Form.Item>
                    <Form.Item>
                        <Form.Item name="remember" valuePropName="checked" noStyle>
                            <Checkbox>记住我</Checkbox>
                        </Form.Item>
                        <Button type="ghost" className="login-form-forgot" href="#">
                            忘记密码
                        </Button>
                    </Form.Item>

                    <Form.Item>
                        <Button type="primary" htmlType="submit" className="login-form-button">
                            登录
                        </Button>
                        <div style={{ height: "20px" }}></div>
                        <a href="#/reg">立即注册</a>
                    </Form.Item>
                </Form>
            </Card>
        </div>)
}